window.onload = function() {
    var province = document.querySelector('#province');
    var tempArr;
    //得到内容渲染页面
    getHtml(province, cityData3);
    // 指向渲染页面函数
    function getHtml(ele, data) {
        var arr = ['<option>请选择</option>'];
        for (var o of data) {
            arr.push(`<option value="${o.value}">${o.text}</option>`);
        }
        ele.innerHTML = arr.join('');
    }
    // 省级菜单触发事件
    province.onchange = function() {
        var val = this.value;
        var data = getData(val, cityData3);
        area.innerHTML = '<option>请选择</option>';
        getHtml(city, data);
    }

    // 获得数据
    function getData(val, data) {
        var arr;
        for (var o of data) {
            if (o.value == val) {
                arr = o.children;
                tempArr = arr;
            }
        }
        return arr;
    }
    //  市级事件绑定
    city.onchange = function() {
        var val = this.value;
        var data = getData(val, tempArr);
        getHtml(area, data);
    }
}